// 1.导入router和vuex
import store from '@/store'
// 进度条引入
import NProgress from 'nprogress'
import 'nprogress/nprogress.css'
// 引入设置页面标题模块
import getPageTitle from '@/utils/get-page-title'
// 引入动态理由表
import router, { asyncRoutes } from '@/router'

// 2.定义白名单
const whiteList = ['/login', '/404']

// 3.设置前置守卫
router.beforeEach(async(to, from, next) => {
  // 设置跳转页面标题,路由meta元里面
  document.title = getPageTitle(to.meta.title)
  NProgress.start()
  // 判断是否有token
  const token = store.state.user.token
  // 有token 看去的路径
  if (token) {
    if (to.path === '/login') {
      next('/')
      NProgress.done()
    } else {
      // 有token没去登陆页
      // 获取用户信息必须有token,并且在跳转前就要获得

      // 先判断有没有用户信息(第一次登陆时已经将用户信息存入到vuex中)
      // 先判断有没有用户信息,没有的话进行信息获取
      if (!store.getters.userId) {
        // 获取用户信息
        // 获取到后端返回的路由信息
        const routerRes = await store.dispatch('user/getuserInfoAction')

        // 将数据进行对比
        const filterRouter = asyncRoutes.filter(item => {
          const routeName = item.children[0].name
          return routerRes.includes(routeName)
        })
        // 将动态路由添加到内存中不会对代码产生影响(addRoutes是vue-router自带的方法)
        filterRouter.push({ path: '*', redirect: '/404', hidden: true })
        router.addRoutes(filterRouter)
        // 将动态路由传到vuex中
        store.commit('permission/setRoutes', filterRouter)
        // addroutes是异步的,不知道那,所以我们给了去的地址
        next({
          path: to.path
        })
      }
      next()
      NProgress.done()
    }
  } else {
    if (whiteList.includes(to.path)) {
      next()
    } else {
      next('/login')
      NProgress.done()
    }
  }
})
// 后置守卫
router.afterEach((to, from) => {
  // 隐藏进度条
  NProgress.done()
})
